<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<title>后台管理系统-首页</title>
	<link rel="stylesheet" type="text/css" href="assets/bootstrap/css/bootstrap.min.css">
	<!-- 进度条插件样式 -->
	<link rel="stylesheet" type="text/css" href="assets/nprogress/nprogress.css">
	<!-- 校验插件样式 -->
	<link rel="stylesheet" type="text/css" href="assets/bootstrap-validator/css/bootstrapValidator.min.css">
	<link rel="stylesheet" type="text/css" href="css/categorySecond.css">
</head>
<body>
	<div class="ad_container">
		<aside class="ad_aside">
			<div class="brand">
				<a href="index.html">ITCAST</a>
			</div>
			<div class="user">
				<img src="images/default.png" >
				<span>超级管理员</span>
			</div>
			<nav class="menu">
				<ol>
					<li class="manage userManage">
						<a href="javascript:;">
							<span class="glyphicon glyphicon-user"></span>
							用户管理
						</a>
					</li>
					<li class="second">
						<a href="javascript:;">
							<span class="glyphicon glyphicon-th-list"></span>
							分类管理
						</a>
						<div class="child">
							<a class="" href="javascript:;">一级分类</a>
							<a class="" href="javascript:;">二级分类</a>
						</div>
					</li>
					<li class="manage productManage">
						<a href="javascript:;">
							<span class="glyphicon glyphicon-tags"></span>
							商品管理
						</a>
					</li>
				</ol>
			</nav>
		</aside>
		<section class="ad_section">
			<header>
				<a href="javascript:;"> <span class="glyphicon glyphicon-align-justify justify"></span> </a>
				<a href="javascript:;"> <span class="glyphicon glyphicon-log-out log_out"></span> </a>
			</header>
			<div class="contanier-fluid">
				<ol class="breadcrumb">
					<li class="active">
						<a href="javascript:;">
							<span>管理系统</span>
						</a>
					</li>
					<li>
						<a href="javascript:;">
							<span>分类管理</span>
						</a>	
					</li>
					<li>
						<a href="javascript:;">
							<span>一级分类</span>
						</a>	
					</li>
				</ol>
				<div class="content">
					<button id="addBtn" class="btn btn-default mb_15">添加分类</button>
					<table class="table table-bordered table-hover" >
						<thead>
							<tr>
								<th width="10%">序号</th>
								<th width="30%">一级分类名称</th>
								<th width="30%">二级分类名称</th>
								<th width="30%">二级分类Logo</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td>1</td>
								<td>itcast</td>
								<td>15188373091</td>
								<td>
									<img src="images/brand1.png" height="51" width="96" alt="">
								</td>
							</tr>
						</tbody>
					</table>
				</div>
				<div class="page">
					<ul class="pagination pagination-sm">
						<!-- TODO:动态生成 -->
					</ul>
				</div>
				<div class="modal fade add_modal">
				  <div class="modal-dialog modal-sm">
				    <div class="modal-content">
				      <div class="modal-header">
				        <button type="button" class="close" data-dismiss="modal" ><span aria-hidden="true">&times;</span></button>
				        <h4 class="modal-title text-left">添加分类</h4>
				      </div>
				      <div class="modal-body ">
				      	<form id="upload">
				      		<div class="form-group">
					      		<label for="categoryName">一级分类:</label>
								<div class="dropdown btn-group">
									<button class="btn btn-default dropdown-toggle" type="button" id="categoryName" data-toggle="dropdown">
									    请选择
									<span class="caret"></span>
									</button>
									<ul class="dropdown-menu">
										<!-- TODO -->
									</ul>
								</div>
								<input type="hidden" name="categoryId">
				      		</div>
				      		<div class="form-group">
				      			<label for="secondName"></label>
				      			<input type="text" class="form-control" id="secondName" name="brandName" placeholder="请输入二级分类名称">
				      		</div>
				      		<div class="form-group" style="position: relative">
				      			<button class="btn btn-default mb_15" type="button" id="dro">上传图片</button>
				      			<input type="file" name="pic1" class="form-control" >
				      			<input type="hidden" name="brandLogo">
				      			<div>
				      				<img src="images/none.png" id="uploadImg" width="120" height="120">
				      			</div>
				      		</div>

				      	</form>
				      </div>
				      <div class="modal-footer">
				        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				        <button type="submit" form="upload" class="btn btn-primary uploadBtn">确定</button>
				      </div>
				    </div><!-- /.modal-content -->
				  </div><!-- /.modal-dialog -->
				</div><!-- /.modal -->
			</div>
		</section>
	</div>
	<div class="modal fade modal_exit" >
	  <div class="modal-dialog modal-sm">
	    <div class="modal-content">
	      <div class="modal-header">
	        <button type="button" class="close" data-dismiss="modal" ><span aria-hidden="true">&times;</span></button>
	        <h4 class="modal-title">温馨提示</h4>
	      </div>
	      <div class="modal-body ">
	        <p class="text-danger"><span class="glyphicon glyphicon-info-sign"></span>您确定要退出后台管理系统吗</p>
	      </div>
	      <div class="modal-footer">
	        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
	        <button type="button" class="btn btn-primary log_out_btn">确定</button>
	      </div>
	    </div><!-- /.modal-content -->
	  </div><!-- /.modal-dialog -->
	</div><!-- /.modal -->
	<script type="text/script" id="dropdown">
		<% 
			var $ = getJquery();
			$.each(rows,function(i,item){
		%>
			<li><a data-id="<%= item.id%>" href="javascript:;"><%= item.categoryName %></a></li>
		<% })%>
	</script>
	<script type="text/x-template" id="list">
		<% 
			var $ = getJquery();
			$.each(rows,function(i,item){ 
		%>
			<tr>
				<td><%= (page-1)*size+i+1%></td>
				<td><%= item.categoryName%></td>
				<td><%= item.brandName%></td>
				<td>
					<img src="<%= item.brandLogo%>"  alt="">
				</td>
			</tr>
		<% }) %>
	</script>
	<script type="text/x-template" id="categorySecond">
		<% for(var i = 0; i < rows.length; i++){ %>
			<tr>
				<td><%= (page-1)*size+i+1%></td>
				<td><%= rows[i].categoryName%></td>
				<td><%= rows[i].brandName%></td>
				<td>
					<img src="<%= rows[i].brandLogo%>" height="51" width="96" alt="">
				</td>
			</tr>	
		<% }%>
	</script>
	<script type="text/javascript" src="assets/jquery/jquery.min.js"></script>
	<!-- 进度条插件 -->
	<script type="text/javascript" src="assets/nprogress/nprogress.js"></script>
	<!--  -->
	<script type="text/javascript" src="assets/bootstrap/js/bootstrap.min.js"></script>
	<!-- 模板 -->
	<script type="text/javascript" src="assets/artTemplate/template-native.js"></script>
	<!-- 分页插件 -->
	<script type="text/javascript" src="assets/bootstrap-paginator/bootstrap-paginator.min.js"></script>
	<!-- 校验插件 -->
	<script type="text/javascript" src="assets/bootstrap-validator/js/bootstrapValidator.js"></script>
	<!-- 上传插件 -->
	<script type="text/javascript" src="assets/jquery-fileupload/jquery.ui.widget.js"></script>
	<!-- 解决跨域 -->
	<script type="text/javascript" src="assets/jquery-fileupload/jquery.iframe-transport.js"></script>
	<!-- 文件上传 -->
	<script type="text/javascript" src="assets/jquery-fileupload/jquery.fileupload.js"></script>
	<script type="text/javascript" src="js/admin.js"></script>
	<script type="text/javascript" src="js/categorySecond.js"></script>

</body>
</html>